import AIBRAIN from '@/assets/image/AIBrain.png';
import ROBOT_AVATAR from '@/assets/image/avatar_robo.png';
import { statistics } from '@/services/ant-design-pro/docList';
import { Button, message } from 'antd';
import React, { useEffect, useState } from 'react';
import { history } from 'umi';
const FloatDialog: React.FC = () => {
  const [isAIExpend, setIsAIExpend] = useState<boolean>(false); //右侧展开收起
  const [statisticalInfo, setStatisticalInfo] = useState<any>(null);

  //获取统计数据
  const getStatistics = async () => {
    let res = await statistics();
    if (res.code === 0) {
      setStatisticalInfo(res.data);
    } else {
      message.open({
        type: 'error',
        content: res.msg,
      });
    }
  };
  const toggleAIExpend = () => {
    console.log(isAIExpend);

    setIsAIExpend(!isAIExpend);
  };
  const goBrainSpaceInfo = () => {
    history.push(`/spaceHome`);
  };
  //获取统计信息
  useEffect(() => {
    getStatistics();
  }, []);

  return (
    <div className="floatDialogWrap">
      <div className="floatDialogAvatar" onClick={toggleAIExpend}>
        <img className="problem-avatar" src={ROBOT_AVATAR} alt="" height={60} width={60} />
        <div className="scan-line"></div>
      </div>
      {statisticalInfo && (
        <div
          className={`floatDialogBox ${
            statisticalInfo ? (isAIExpend ? 'dialogOn' : 'dialogOFF') : ''
          }`}
          style={{ backgroundImage: `url(${AIBRAIN})` }}
        >
          <div className="AIutterance">
            {
              statisticalInfo?.sentences[
                Math.floor(Math.random() * statisticalInfo?.sentences.length)
              ]
            }
          </div>
          <div className="brainSpaceInfoBox">
            <div className="brainSpaceInfo">
              <span className="brainSpaceInfo-hd">行政局知识空间</span>
              <span className="brainSpaceInfo-bd">{statisticalInfo?.count?.fact}</span>
            </div>
            <div className="brainSpaceInfo">
              <span className="brainSpaceInfo-hd">重要讲话空间</span>
              <span className="brainSpaceInfo-bd">{statisticalInfo?.count?.speech}</span>
            </div>
            <div className="brainSpaceInfo">
              <span className="brainSpaceInfo-hd">公文模板空间</span>
              <span className="brainSpaceInfo-bd">{statisticalInfo?.count?.format}</span>
            </div>
            <div className="brainSpaceInfo">
              <span className="brainSpaceInfo-hd">好文收藏空间</span>
              <span className="brainSpaceInfo-bd">{statisticalInfo?.count?.good_article}</span>
            </div>
            <div className="brainSpaceInfo">
              <span className="brainSpaceInfo-hd">好词好句空间</span>
              <span className="brainSpaceInfo-bd">{statisticalInfo?.count?.good_sentence}</span>
            </div>

            <div className="brainSpaceInfo">
              <span className="brainSpaceInfo-hd">定期收集空间</span>
              <span className="brainSpaceInfo-bd">{statisticalInfo?.count?.collection}</span>
            </div>
          </div>
          <div className="goBrainSpaceInfo">
            <Button type="primary" onClick={goBrainSpaceInfo}>
              大脑空间
            </Button>
          </div>
        </div>
      )}
    </div>
  );
};
export default FloatDialog;
